<%--
  Created by IntelliJ IDEA.
  User: wei
  Date: 2019/5/20
  Time: 14:33
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<html>
<head>
    <head>
        <title>Title</title>
        <script src="../../js/jquery-3.3.1.min.js" charset="utf-8"></script>
        <script src="../../js/cookie/jquery.cookie.js" charset="utf-8"></script>
        <script src="../../layui-v2.2.5/layui/layui.js" charset="utf-8"></script>
        <link rel="stylesheet" href="../../layui-v2.2.5/layui/css/layui.css" media="all">

    </head>
</head>
<body>

<div class="layui-form">
    <form class="layui-form" action="">
        <table class="layui-table">
            <thead>
            <tr>
                <th>用户名称</th>
                <th>账户</th>
            </tr>
            </thead>
            <tbody>
                    <c:forEach items="${PageUtil.list}" var="cl">
                <tr>
                    <td>${cl.id}</td>
                    <td>${cl.userId}</td>
                </tr>
                    </c:forEach>
            </tbody>
        </table>
        <input type="hidden" id="id" value="${id}">
    </form>
    <div id="fenye"></div>

    <div id="under" style="margin-top: 20rem"></div>
    <script>
        layui.use('laypage', function(){
            var laypage = layui.laypage;
            laypage.render({
                elem: 'fenye'
                ,count: ${PageUtil.totalRows}
                ,limit:10//数据总数，从服务端得到
                ,curr:${PageUtil.currentPage}
                ,hash:true
                ,jump: function(obj, first){
                    var id=$("#id").val();
                    //obj包含了当前分页的所有参数，比如：
                    console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
                    console.log(obj.limit); //得到每页显示的条数
                    //首次不执行
                    if(!first){
                        window.location.href="/shop/accountRecord?page="+obj.curr+"&limit="+obj.limit+"&id="+id;
                    }
                }
            })
        })
    </script>
</div>
</body>
</html>

